const TOOLBAR =[
	{content:"添加供应商", icon:"el-icon-document-add",type:"primary"}
]
const COLUMNS = [
	{prop:"createdate", label:"创建日期",width:"80"},
	{prop:"name", label:"供应商名称",width:"180"},
	{prop:"city", label:"城市",width:"80"},
	{prop:"contacter", label:"联系人",width:"80"},
	{prop:"tel", label:"联系电话",width:"120"},
	{prop:"poclear", label:"结算方式",width:"50"},
	{prop:"paytype", label:"付款方式",width:"50"},
	{prop:"isinvoice", label:"开票",width:"50"},
	{prop:"status", label:"状态",width:"50"},
	{prop:"remark", label:"备注",width:"100"},
]

			
let app = new Vue({
    el: "#app",
    data() {
        return {
        	leftbar_show:true,
			// 添加、编辑标识
			tableHeight:window.innerHeight - 180,
			toolbar:TOOLBAR,
			tablecolums:COLUMNS,
			supplierFormVisible:false,
			supplierDetailFormVisible :false,
			queryForm:{
                keyword: "",
				serviceid: [],
				status:[],
				pageNo:1, // 当前页码
				pagesize:100 ,// 每页记录数
				pagesizes:[10,20,50,100,500]
				
			},
			pagetotal:0,
			supplierRules:{// 数据验证规则
				name: [
					{required: true, message: '请输入供应商名称', trigger: 'blur'}
				],
				contacter: [
					{required: true, message: '请输入联系人', trigger: 'blur'}
				],
				tel: [
					{required: true, message: '请输入联系电话', trigger: 'blur'}
				]
			}, 
			supplierDetailRules:{// 数据验证规则
				serviceid: [
					{required: true, message: '请输入服务项目名称', trigger: 'blur'}
				],
				cost: [
					{required: true, message: '请输入成本价格', trigger: 'blur'}
				],
				price: [
					{required: true, message: '请输入单价', trigger: 'blur'}
				]
			}, 
			supplierForm: {
				id:null,
                city: "",
				contacter: "",
				tel: "",
				poclear: "次结",
				paytype: "对私",
				isinvoice: "否",
				status: "正常",
				remark: ""
            },
			supplierDetailForm:{
				id:null,
				serviceid: "",
			    service: "",
				supplierid: "",
				supplier: "",
				specs: "",
				cost: 0,
				price: 0,
				memo: "",
				industry: "",
				area: ""
			},
			services:[],
			// 多选
			multipleSelection:[],
			pagedata:[],  // 当前页结果集
			loaded:false,
        }
    },
	methods: {
		// 显示侧边栏
		showLeftBar() {
			if (this.leftbar_show) {
				this.leftbar_show = false
			} else {
				this.leftbar_show = true
			}
		},
		// 表格多选
		handleSelectionChange(val) {
			this.multipleSelection = val;
		},
		selectionChange(selection){
			this.selection = selection
		},
		toolAction(acName) {
			if (acName == "添加供应商") {
				this.add()
			} 
		},
		// 确认
		async cofirm(){
            this.$refs.supplierForm.validate(async valid => {
                if (valid){
					// 显示加载框
					const loading = this.$loading(LOAD_STYLE);
					try {
						let res = null;
						if (this.action=="add") {
							//添加供应商
							res = await axios.put('api/supplier/add', this.supplierForm);
						} else if(this.action=="edit") {
							// 编辑供应商
							res = await axios.put('api/supplier/update', this.supplierForm);
						}
						if (res.code === 200) {
							this.query();
							this.supplierFormVisible = false
						}else {
							this.$message.error(res.message);
						}		
					}catch (e) {
						this.$message.error('添加或编辑请求出错！', e.message);
					}
					// 关闭加载框
					loading.close();
                }
            })			
		},
		// 确认明细
		async cofirmDetail(){
		    this.$refs.supplierDetailForm.validate(async valid => {
		        if (valid){
					// 显示加载框
					const loading = this.$loading(LOAD_STYLE);
					try {
						let res = null;
						if(this.action=="adddetail") {
							// 添加供应商服务
							res = await axios.put('api/supplier/adddetail', this.supplierDetailForm);
						} else if(this.action=="editdetail") {
							// 编辑供应商服务
							res = await axios.put('api/supplier/updatedetail', this.supplierDetailForm);
						}
						if (res.code === 200) {
							this.query();
							this.supplierDetailFormVisible = false
						}else {
							this.$message.error(res.message);
						}		
					}catch (e) {
						this.$message.error('添加或编辑服务明细请求出错！', e.message);
					}
					// 关闭加载框
					loading.close();
		        }
		    })			
		},
		start(){
			this.queryForm.pageNo = 1
			this.query()
		},
		// 查询
		async query() {
			// 显示加载框
			const loading = this.$loading(LOAD_STYLE);
			try {
				this.pagetotal = 1;
				let res = await axios.post('api/supplier/query', this.queryForm);
				if (res.code === 200) {
					this.pagedata = res.data;
					this.pagetotal = res.total;
					this.$message.success(res.message);
				}else {
					this.$message.error(res.message);
				}
			}catch (e) {
				this.$message.error('查询请求出错！', e.message);
			}
			
			// 关闭加载框
			loading.close();
		},
		// 添加
		add() {
			this.action="add";
			this.supplierFormVisible = true;
		    this.supplierForm= {
				id:null,
                city: "",
				contacter: "",
				tel: "",
				poclear: "次结",
				paytype: "对私",
				isinvoice: "否",
				remark: ""
		    }
		},
		// 编辑
		edit(index, row) {
			this.action="edit";
			this.index = index;
			this.supplierFormVisible = true;
			this.supplierForm = deepCopy(row)
		},
		// 删除
		del(index, row) {
			try {
				this.$confirm('确认要删除该供应商吗?', '提示', {
								confirmButtonText: '确定',
								cancelButtonText: '取消',
								type: 'warning'
							}).then(async () => {
								let res = await axios.put('api/supplier/delete', row);
								if (res.code === 200) {
									this.query();
								}else {
									this.$message.error(res.message);
								}	
							}).catch((e) => {
								if (e.message) this.Msg('error', e.message);
							});
				}catch (e) {
					this.$message.error('删除请求出错！', e.message);
				}
		},
		// 删除
		delDetail(index, row) {
			try {
				this.$confirm('确认要删除该供应商服务项目吗?', '提示', {
								confirmButtonText: '确定',
								cancelButtonText: '取消',
								type: 'warning'
							}).then(async () => {
								let res = await axios.put('api/supplier/deletedetail', row);
								if (res.code === 200) {
									this.query();
								}else {
									this.$message.error(res.message);
								}	
							}).catch((e) => {
								if (e.message) this.Msg('error', e.message);
							});
				}catch (e) {
					this.$message.error('删除请求出错！', e.message);
				}
		},
		// 添加明细
		addDetail(index, row) {
			this.action="adddetail";
			this.supplierDetailFormVisible = true;
		    this.supplierDetailForm= {
				id:null,
                serviceid: "",
                service: "",
                supplierid: row.id,
				supplier: "",
				specs: "",
				cost: 0,
				price: 0,
				memo: "",
				industry: "",
				area: ""
		    }
		},
		// 编辑明细
		editDetail(index, row) {
			this.action="editdetail";
			this.supplierDetailFormVisible = true;
			this.supplierDetailForm = deepCopy(row)
		},
		// 取得所有服务项目
		async getService() {
			// 显示加载框
			const loading = this.$loading(LOAD_STYLE);
			try {
				let res = await axios.get('api/service/get');
				if (res.code === 200) {
					this.services = res.data;
				}else {
					this.$message.error(res.message);
				}
			}catch (e) {
				this.$message.error('服务项目请求出错！', e.message);
			}
			
			// 关闭加载框
			loading.close();
		},
		
		// 设定表格当前页
		handleCurrentPageChange (selectedPageNo) {
		  this.queryForm.pageNo = selectedPageNo
		  // 加载数据页
		  this.query()
		},
	},
	async mounted() {
		// 自动调整表格高度
		window.onresize = () => {
		  return (() => {
			this.tableHeight = window.innerHeight - 180
		  })()
		}
		
		this.getService();
	}

});	